﻿@{
    ViewBag.Title = "OA办公系统";
    Page.BodyStyle = "style='background:#FFFFFF; overflow:hidden;'";
}
<style>
    .loginbgdiv {
        background:#FFFFFF;
    }
    .loginbgdiv input{
        outline: none !important;
    }
    .loginbgdiv .top{
        width:100%;
        height: 100px;
        position:relative;
    }
    .loginbgdiv .top img {
        height: 90px;
        position: relative;
        margin: 5px 194px;
    }
    .loginbgdiv .center {
        width: 100%;
        height: 58%;
    }
    .loginbgdiv .center img {
        height: 100%;
        width:100%;
    }
    .loginbgdiv .bottom {
        width: 100%;
        height: 10%;
        text-align:center;
        position: absolute;
        bottom:10px;
    }

    html, body, form {
        width: 100%;
        height: 100%;
    }

    .window_maindiv {
        border-radius: 10px;
        position: absolute;
        background: #ffffff;
        overflow: hidden;
        border: 0;
        box-shadow: 0;
        -moz-box-shadow: 0;
        -webkit-box-shadow: 0;
        background-color: #ffffff;
    }

    .window_title {
        border-radius: 2px;
        text-align: center;
        height: 26px;
        padding-left: 5px;
        color: #313c65;
        padding-right: 0px;
        background: #FFF;
        display: none;
    }

    .mytext:hover, .mytext:hover,
    .text1, .text2 {
        border-radius: 0;
        background: #FFFFFF;
        border: 0;
        border-bottom: 1px solid #e5e5e5;
        -webkit-appearance: none;
        line-height: 16px;
        vertical-align: middle;
        height: 26px;
        width: 100%;
        padding-left: 2px;
        margin: 0;
        -moz-box-shadow: none; /* For Firefox3.6+ */
        -webkit-box-shadow: none; /* For Chrome5+, Safari5+ */
        box-shadow: none; /* For Latest Opera */
        outline: none !important;
        text-align:center;
    }

    .button1, .button2, .mybutton, .mybutton:hover {
        border-radius: 360px;
        background: #f7a746;
        border: 0;
        color: #ffffff;
        vertical-align: middle;
        height: 36px;
        font-size: 14px;
        box-shadow: none;
        cursor: pointer;
    }

    .mytext.text1.user {
        background: url(../../Images/login/user.png) no-repeat;
        background-size: 20px 20px;
        background-position: 0 5px;
    }

    .mytext.text1.psw {
        background: url(../../Images/login/psw.png) no-repeat;
        background-size: 20px 20px;
        background-position: 0 5px;
    }

    input {
        outline: #ffffff;
    }

</style>

<form id="form1" method="post">
    @Html.AntiForgeryToken()
    <div id="bgdiv" class="loginbgdiv">
        <div class="top">
            <img src="~/Images/login/logintop.png" />
        </div>
        <div class="center">
            <img src="~/Images/login/loginbg.jpg" />
        </div>
        <div class="bottom">
            <p>Copyright © 版权所有</p>
        </div>
    </div>
    <div id="logindiv" style="display:none; margin-top:0px;height:calc(100% + 22px);padding-top:0px;height: calc(100% + 26px);">
        <input type="hidden" id="Force" name="Force" value="0" />
        <table cellpadding="0" cellspacing="1" border="0" style="width:100%; margin:0 auto;">
            <tr>
                <td colspan="2" style="text-align:center;padding: 40px 0 30px;">
                    <i style="font-size:24px; font-style:normal;font-weight:bolder;">用户登录</i>
                </td>
            </tr>
            <tr>
                <td colspan="2" class="td" style="padding:8px 24px 0;">
                    <input type="text" class="mytext text1 user" id="Account" name="Account" value="" placeholder="请输入账  号"  maxlength="50" autocomplete="off" />
                </td>
            </tr>
            <tr>
                <td colspan="2" class="td" style="padding:8px 24px 0;">
                    <input type="password" class="mytext text1 psw" id="Password" name="Password" placeholder="请输入密  码"  maxlength="50" autocomplete="off" />
                </td>
            </tr>
            <tr id="novcode" style="display:none;" >
                <td colspan="2" style="padding:8px 24px 0;position:relative;">
                    <img alt="" src="@Url.Content("~/Login/VCode?"+DateTime.Now.Ticks)" onclick="cngimg();" style="vertical-align:middle;border-radius: 2px;position:absolute;" id="VcodeImg" />
                    <input type="text" class="mytext text2" id="VCode" placeholder="请输入验证码" name="VCode" maxlength="4" autocomplete="off" />
                </td>
            </tr>
            <tr>
                <td colspan="2" style="padding:10px 24px 0;" valign="top">
                    <input type="button" id="loginbutton" value=" 登 录 " class="mybutton" style="width: 100%;height: 36px;margin-top:54px;" onclick="return checkForm(this);" />
                </td>
            </tr>
        </table>
    </div>
</form>
<script type="text/javascript">
    var win = new RoadUI.Window();
    var isVCode = "1" == "@Session["IsValidateCode"]";

    $(function ()
    {
        $(document.body).bind("keydown", KeyDown);
        var left = $(window).width() / 2 + 140;
        var top = $(window).height() / 2 - 210;
        win.open({ elementid: "logindiv", width: 300, height: 330, top: top, left: left, showico: false, title: "", resize: false, ismodal: false, showclose: false });
        if (isVCode)
        {
            showVCode();
        }
    });

    function KeyDown()
    {
        var e = document.all ? window.event : arguments[0] ? arguments[0] : event;
        if (e && e.keyCode == 13)
        {
            e.returnValue = false;
            e.cancel = true;
            $("#loginbutton").click();
        }
    }

    function cngimg()
    {
        $('#VcodeImg').attr('src', '@Url.Content("~/Login/VCode?")' + new Date().toString());
    }
    function showVCode()
    {
        $("#novcode").show();
        $("#loginbutton").css("margin-top", "28px");
    }

    ////禁止后退键 作用于Firefox、Opera  
    //document.onkeypress = keydown;
    ////禁止后退键  作用于IE、Chrome  
    //document.onkeydown = keydown;
    //function keydown(e)
    //{
    //    var ev = e || window.event;//获取event对象
    //    if (ev && ev.keyCode && ev.keyCode == 13)
    //    {
    //        checkForm();
    //    }
    //}

    function checkForm()
    {
        var form1 = document.forms[0];
        if ($.trim(form1.Account.value).length == 0)
        {
            alert("帐号不能为空!");
            form1.Account.focus();
            return false;
        }
        if ($.trim(form1.Password.value).length == 0)
        {
            alert("密码不能为空!");
            form1.Password.focus();
            return false;
        }
        if (isVCode && form1.VCode && $.trim(form1.VCode.value).length == 0)
        {
            alert("验证码不能为空!");
            form1.VCode.focus();
            return false;
        }
        var $but = $("#loginbutton");
        $but.val("登录中...").prop("disabled", true);
        var token = $('input[name="__RequestVerificationToken"]', form1).val();
        $.ajax({
            url: "@Url.Content("~/Login/CheckLogin")",
            type: "POST",
            dataType: "json",
            async: true,
            data: { __RequestVerificationToken: token, Account: form1.Account.value, Password: form1.Password.value, VCode: form1.VCode.value, Force: form1.Force.value },
            success: function (json)
            {
                switch (json.status)
                {
                    case 0:
                        alert(json.msg);
                        win.resize(300, 330);
                        showVCode();
                        isVCode = true;
                        cngimg();
                        $but.val("登录").prop("disabled", false);
                        break;
                    case 1:
                        window.location = "@Url.Content("~/Home/Index")";
                        break;
                    case 2:
                        if (confirm(json.msg))
                        {
                            $('#Force').val("1");
                            checkForm();
                        }
                        else
                        {
                            $but.val("登录").prop("disabled", false);
                        }
                        break;
                }
            }
        });
    }
</script>
